<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页</title>
    <link rel="icon" href="img/tubiao.jpg">
    <link rel="stylesheet" href="css/index.css">
</head>
<body>
    <!-- 头部 -->
    <div class="head">
 
  </div>
    <!-- 中间 -->
    <div class="center">
        <h3>闪习——填补你的碎片时间</h3>
        <!-- 左边 -->
        <div class="left">
            <p class="p1" >类别</p>
            <p class="p2">全部</p>
            <p>科普类</p>
            <p>社会类</p>
            <p>历史类</p>
        </div>

        <!-- 右边 -->
        <div class="right">
            <div class="search">
                <input placeholder="搜索"/>
                <div class="auth-buttons">
        <a href="login.html" class="auth-btn login">登录</a>
        <a href="register.html" class="auth-btn register">注册</a>
    </div>
            </div>
            <div class="content">
                <!-- 课程项 -->
                <div class="item">
                    <img src="img/1.png">
                    <p>从爱因斯坦到霍金的宇宙</p>
                </div>
                <div class="item">
                    <img src="img/2.png">
                    <p>中华民族精神</p>
                </div>
                <div class="item">
                    <img src="img/3.png">
                    <p>建筑信息模型BIM技术应用</p>
                </div>
                <div class="item">
                    <img src="img/4.png">
                    <p>手工制作与环境创设</p>
                </div>
                <div class="item">
                    <img src="img/5.png">
                    <p>展示空间设计</p>
                </div>
                <div class="item">
                    <img src="img/6.png">
                    <p>信息工程学院课堂签到</p>
                </div>
               
            </div>
            <!-- 分页 -->
            <div class="page">
                <button>1</button>
                <button>2</button>
                <button>3</button>
                <button>4</button>
                <button>5</button>
                <button>下一页 > </button>
                <button>尾页</button>
            </div>
        </div>
    </div>
    <!-- 底部 -->
    <div class="foot">
        客服电话 404-233-1145    &nbsp;&nbsp;
        远神无敌公司旗下网站-闪习  &nbsp;&nbsp;
        <a href="#">管理</a>
    </div>
</body>
</html>